<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<style type="text/css">
	#xialakuang{
		width: 172px;
		position: absolute;
		left: 72px;
		background-color: white;
	}
</style>
<script type="text/javascript" src="../js/jquery-1.8.3.js"></script>
<script type="text/javascript">
	
	$(function(){
		if (document.getElementById("tiaozhuan")!=null) {
			document.getElementById("tiaozhuan").value=${ requestScope.pageindex };
		}
		if (document.getElementById("tiaozhuan1")!=null) {
			document.getElementById("tiaozhuan1").value=${ requestScope.pageindex };
		}
		document.getElementById("selectuser").value="${ requestScope.namelike }";
			
		$("#checkboxs").click(function(){
			if ($(this).attr("checked")=="checked") {
				$("[type='checkbox']").each(function(){
					$(this).attr("checked",true);
				})
			}else{
				$("[type='checkbox']").each(function(){
					$(this).attr("checked",false);
				})
			}
		})
		$("#selectuser").keyup(function(){
			if ($(this).val()!="") {
				$.post("SelectUserName",{username:$(this).val()}
				,callback)
			}else{
				$("#xialakuang").html("");
			}			
		})
		
		
		
		
	})
	function add(){
		$(".selectedname").bind({
			mouseover:function(){
				$(this).css("background","#ccc");
			},
			mouseout:function(){
				$(this).css("background","");
			},
			click:function(){
				$("#selectuser").val($(this).html());
				$("#xialakuang").html("");
			}
		})
	}
	
	function callback(data){
			var $xialakuang = $("#xialakuang");
			$xialakuang.html("");
			var names="";
			var users = data.split("-");
			if(users.length>0){
				for (var i = 0; i < users.length; i++) {
					names += "<div class='selectedname'>";
					names += users[i];
					names += "</div>";
				}
			}
			$xialakuang.html(names);
			add();
		}
	
	function chang(){		
		var n =$("#tiaozhuan").attr("value");		
		location="ShowUsers?item=all&pageNumber="+n;
	}
	function chang1(){		
		var n =$("#tiaozhuan1").attr("value");		
		location="ShowUsers?item=search&namelike=${ requestScope.namelike }&pageNumber="+n;
	}
	
	function del(){
		if(confirm("确认删除?")){
			return true;
		}else{
			return false;
		}
	}
	
</script>
</head>
<body>
管理用户:<br/>
<div>
<form action="ShowUsers?item=search" method="post">
搜索用户<input type="text" id="selectuser" name="namelike" value="" />
	<input type="submit" value="点击搜索" />
	<div id="xialakuang"></div>
</form>
</div>
<form action="DeleteUsers" method="post" onsubmit="return del()">
	<table>
	<tr>
		<td><input type="checkbox" id="checkboxs" /></td>
		<th>用户ID</th>	
		<th>用户名</th>	
		<th>用户密码</th>	
		<th>用户最近登陆时间</th>	
		<th>操作</th>	
	</tr>
	<c:forEach items="${ requestScope.list }" var="user">	
		<tr>
			<td><input type="checkbox" name="checks" value="${ user.user_id }" /></td>
			<td>${ user.user_id }</td>
			<td>${ user.user_name }</td>
			<td>----------</td>
			<td>${ sdf.format(user.user_date) }</td>
			<td>
				<a href="UpdateUsers?item=one&username=${ user.user_name }">修改</a>
				<a href="DeleteUsers?item=one&userid=${ user.user_id }" onclick="return del()">删除</a>
			</td>
		</tr>
	</c:forEach>
		<tr><td><input type="submit" value="批量删除"  />
		<tr>
		<c:choose>
		<c:when test="${ requestScope.state ne 'search' }">
			<td colspan="6">
			<a href="ShowUsers?item=all&pageNumber=1">首页</a>
			<a href="ShowUsers?item=all&pageNumber=${ requestScope.pageindex-1 }">上一页</a>
			跳至第<select onchange="chang()" id="tiaozhuan" >     
         	<c:forEach var="i" begin="1" end="${requestScope.pages}" > 
        	<option value='${i}'>${i}</option>
       		</c:forEach>
        	</select>页
			<a href="ShowUsers?item=all&pageNumber=${ requestScope.pageindex+1 }">下一页</a>
			<a href="ShowUsers?item=all&pageNumber=${ requestScope.pages }">末页</a>			
			</td>
		</c:when>
		<c:otherwise>
			<td colspan="6">
			<a href="ShowUsers?item=search&pageNumber=1&namelike=${ requestScope.namelike }">首页</a>
			<a href="ShowUsers?item=search&pageNumber=${ requestScope.pageindex-1 }&namelike=${ requestScope.namelike }">上一页</a>
			跳至第<select onchange="chang1()" id="tiaozhuan1" >     
         	<c:forEach var="i" begin="1" end="${requestScope.pages}" > 
        	<option value='${i}'>${i}</option>
       		</c:forEach>
        	</select>页
			<a href="ShowUsers?item=search&pageNumber=${ requestScope.pageindex+1 }&namelike=${ requestScope.namelike }">下一页</a>
			<a href="ShowUsers?item=search&pageNumber=${ requestScope.pages }&namelike=${ requestScope.namelike }">末页</a>			
			</td>
		</c:otherwise>
		</c:choose>
		</tr>
	</table>
</form>
</body>
</html>